<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>乐视-登录</title>
    <link rel="stylesheet" href="./scss/login.css">
    <link rel="stylesheet" href="../图标图标/iconfont.css">
</head>

<body>
    <!-- 头部LOGO -->
    <header>
        <p><img src="./images/login.png" alt=""></p>
        <ul>
            <li>语言：<span>简体中文</span></li>
            <li>国家/地区：<span>中国</span></li>
            <li>帮助</li>
        </ul>
    </header>
    <!-- 主题，登录页面 -->
    <section>
        <main>
            <p><span>登录</span><a target="_blank" href=""><span class="iconfont icon-shouji1"></span>短信验证码登录</a></p>
            <nav>
                <p><span class="iconfont icon-wode"></span><input type="text" id="username" placeholder="邮箱/手机号"
                        autocomplete="off"><img src="./images/2wm.png"></p><br />
                <p><span class="iconfont icon-anquanshezhi"></span><input type="password" id="password"
                        placeholder="密码"></p>
                <h6><input type="checkbox" id="agree">&nbsp;记住登录状态<a target="_blank" href="">重置密码</a> </h6>
                <input type="button" value="登&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;录" id="Btn" /><br />
            </nav>
            <footer>
                <p>从这里出发，开启生态世界<a target="_blank" href="./register.html">&nbsp;&nbsp;立即注册</a></p>
                <div class="bott">
                    <p>
                        <span>其他方式登录</span>
                    </p>
                    <ul>
                        <li class="qq"></li>
                        <li class="wx"></li>
                        <li class="wb"></li>
                        <li class="zfb"></li>
                    </ul>
                </div>
            </footer>
        </main>
    </section>

    <script src="./js/jQuery.js"></script>
    <script src="./js/cookie.js"></script>

    <script>
        $(function () {
            // 业务 : 
            // - 1. 点击按钮发送请求; 
            //    - 发送请求的方式 : 
            //         1. xhr   发送请求; 
            //         2. fetch 发送请求; 
            // - 2. 根据响应数据决定提示内容;
            let but = $("#Btn");
            let username = $("#username");
            let password = $("#password");

            but.click(function () {
                load()
                .done( function( data ){
                    // console.log(username);
                    console.log(data);
                    switch( data.code ){
                        case 1 :
                            console.log(data);
                            setTimeout( function(){
                                location.href = "./shouye.html"
                            } , 2000)

                            // 登录成功之后获取存储用的id;
                            setCookie( "userid" , data.user.id );
                            setCookie( "token" , data.token , {
                                expires : 1
                            } )
                    }
                })

            })
            function load() {
                let options = {
                    url: "http://127.0.0.1:8888/users/login",
                    type: "POST",
                    data: {
                        username: `${username[0].value}`,
                        password: `${password[0].value}`
                    },
                    dataType: "json"
                }
                return $.ajax(options);
            }

            // but.onclick = async function () {
            //     var options = {
            //         url: "http://127.0.0.1:8888/users/login",
            //         type: "POST",
            //         data: {
            //             username: username.value,
            //             password: password.value
            //         },
            //         dataType: "json"
            //     }
            //     $.ajax(options)
            //         .done(function (data) {
            //             console.log(data);
            //             console.log(1);
            //             // 用switch定义code情况; 
            //             switch (data.code) {

            //                 case 1:

            //                     setTimeout(function () {
            //                         location.href = "./shouye.html"
            //                     }, 2000)
            //                     // 登录成功之后获取存储用的id; 
            //                     setCookie("userid", data.user.id);
            //                     setCookie("token", data.token, {
            //                         expires: 1
            //                     });

            //                     break;
            //             }
            //         })

            // }



        })

    </script>


</body>

</html>